﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<skags.Models.ChildTimelineViewModel>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
	Tímalína barns
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<div id="navigation">
<% Html.RenderPartial("IndexNavigation"); %>
</div>
<div id="content">
    <script src="/Scripts/timelineJS.js" type="text/javascript"></script>
    <p>Hér getur þú séð tímalínu barns sem er valið</p><br />
    <!--VELJA BARN -->
    <%  if (Model.Children.Count() == 0)
        {
            Response.Write("Þú hefur ekki skráð nein börn.");
        }
    else
    {%>
        <span id= "timelineButton">
            <%= Html.ActionLink("Bæta á Línu", "AddToTimeline")%>
            <%= Html.ActionLink("Breyta", "TimelineList")%>
        </span>
        <p> Veldu barn: </p>
        <ul class="chooseChild">
        
            <% foreach (var cItem in Model.Children)
               {%>
                    <li><%= Html.ActionLink(cItem.Name, "Timeline", new { id = cItem.ID })%></li>
            <% }%>
        </br> </br> </br>
        </ul>
      
       
         <% if (Model.Timelines.Count() == 0)
            {
                Response.Write("<p id=\"child_response\">Þú hefur ekki sett neitt á tímalínu barnsins.</p>");
            }
            else
            {%>

        <div id="timeline">
               <div id="babyIcon">
                    <img src="/Content/images/infant.png" name="babyIcon" height="100" width="100" alt="Baby Icon" />
               </div>
            <div id="timer">
               <ul>
                    <li>tímalínan</li>
                <% foreach (var tItem in Model.Timelines)
                        {
                            var date = (tItem.LineDate).ToString("dd. MMM");
                            var year = (tItem.LineDate.Year);
                            int age =  year-(tItem.Child.BirthDate.Year);
                            if (age < 0) { age = 0; }
                            var info = tItem.OtherInfo;
                            
                           %>
                                <li><a href="#" onmouseover="GoToTime('<%:age%>', '<%: info %>', '<%: date%>', '<%: year%>')" ><%: date%></a></li>
                <%} %>  
               
              </ul>
             
            </div><!--end timer-->
            <div id="displayItems">
                <div id="timelineYear"></div> 
                <div id="timelineDate"></div>
                <div id="timelineText"></div> 
                
             </div>
              <div id= "childName"><%: Model.Child.Name %></div>
             
        </div><!--end timeline-->
 
        <%} //end ELSE %>
    <%} // end ELSE%>

</div>
</asp:Content>
